<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org/">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" th:src="@{/erp/js/html5.js}"></script>
    <script type="text/javascript" th:src="@{/erp/js/respond.min.js}"></script>
    <script type="text/javascript" th:src="@{/erp/js/PIE_IE678.js}"></script>
    <![endif]-->
    <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
    <link th:href="@{/erp/assets/css/codemirror.css}" rel="stylesheet">
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/Widget/zTree/css/zTreeStyle/zTreeStyle.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}"/>
    <link th:href="@{/erp/assets/css/bootstrap.min.css}" rel="stylesheet"/>
    <link rel="stylesheet" th:href="@{/erp/css/style.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/ace.min.css}"/>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome.min.css}"/>
    <link th:href="@{/erp/Widget/icheck/icheck.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/erp/js/jquery-1.9.1.min.js}"></script>
    <script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
    <!--[if IE 7]>
    <link rel="stylesheet" th:href="@{/erp/assets/css/font-awesome-ie7.min.css}"/>
    <![endif]-->
    <link th:href="@{/erp/Widget/icheck/icheck.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/erp/Widget/webuploader/0.1.5/webuploader.css}" rel="stylesheet" type="text/css"/>
    <script th:src="@{/erp/js/jquery-1.9.1.min.js}"></script>
    <script th:src="@{/erp/assets/js/bootstrap.min.js}"></script>
    <script th:src="@{/erp/assets/js/typeahead-bs2.min.js}"></script>
    <script th:src="@{/erp/assets/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/erp/assets/laydate/laydate.js}" type="text/javascript"></script>
    <script type="text/javascript" th:src="@{/erp/Widget/My97DatePicker/WdatePicker.js}"></script>
    <script type="text/javascript" th:src="@{/erp/Widget/icheck/jquery.icheck.min.js}"></script>
    <script type="text/javascript" th:src="@{/erp/Widget/zTree/js/jquery.ztree.all-3.5.min.js}"></script>
    <script type="text/javascript" th:src="@{/erp/Widget/Validform/5.3.2/Validform.min.js}"></script>
    <script th:src="@{/erp/js/lrtk.js}" type="text/javascript"></script>
    <title>分类管理</title>

</head>
<body>

<div class="clearfix" id="add_picture">
    <div id="scrollsidebar" class="left_Treeview">
        <div class="show_btn" id="rightArrow"><span></span></div>
        <div class="widget-box side_content">
            <div class="side_title"><a title="隐藏" class="close_btn"><span></span></a></div>
            <div class="side_list">
                <div class="widget-header header-color-green2">
                    <h4 class="lighter smaller">分类列表</h4>
                </div>
                <div class="widget-body">
                    <div class="widget-main padding-8">
                        <div id="treeDemo" class="ztree"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="page_right_style">

    </div>
</div>
</body>
</html>
<script>

    $(function() {
        $("#add_picture").fix({
            float : 'left',
            skin : 'green',
            durationTime :false,
            stylewidth:'220',
            spacingw:0,
            spacingh:260,
        });
    });
</script>
<script type="text/javascript">
    //右侧显示
    $(document).ready(function () {
        //初始化宽度、高度
        $(".widget-box").height($(window).height());
        $(".page_right_style").height($(window).height());
        $(".page_right_style").width($(window).width() - 220);
        //当文档窗口发生改变时 触发
        $(window).resize(function () {
            $(".widget-box").height($(window).height());
            $(".page_right_style").height($(window).height());
            $(".page_right_style").width($(window).width() - 220);
        });
    });
    /******树状图********/
    $(document).ready(function () {
        var setting = {
            async: {
                enable: true,
                url: '/sort/treeSort'
            },
            data: {
                key: {
                    name: "sortName"
                },
                simpleData: {
                    enable: true,
                    idKey: "id",
                    pIdKey: "pid",
                    rootPId: ''
                }
            },
            callback: {
                onClick: onClick
            },
            view: {
                showIcon: false,
            }
        };
        var t = $("#treeDemo");
        t = $.fn.zTree.init(t, setting);
        //加载右侧页面
        $('.page_right_style').load("/product/addtypesPage");
    });

    function onClick(event, treeId, treeNode, clickFlag) {
        $('.page_right_style').load("/sort/updTree?sortId=" + treeNode.id);
    }

    function xinzeng() {
       // document.getElementById("shanchu").style.display = "none";
        document.getElementById("spans1").style.display = "none";
        document.getElementById("spans2").style.display = "block";
    }

</script>
